<script setup lang="ts">
import {ref} from 'vue'
import {useAnalysetStore} from "@/store";
import AnalyesAPI from "@/api/system/analyes";
import router from "@/router";
import {getUserInfo} from "@/utils/auth";
import routeMap from "@/utils/routeMap";

const analyseStatusPage = useAnalysetStore()
const form = ref({})
const qcForm = ref({})
const analyseTableList = ref([])
const userInfo = JSON.parse(getUserInfo())

const personnelList = ref([])
let checkList = ref([])
let filteredData = ref([])
const parameterForm = ref({
  test_parms: '',
  testparmsId: '',
  testParms: '',
})
const statusMap = ref({
  0: '草稿',
  1: '待校核',
  2: '校核驳回',
  3: '校核通过',
  4: '待审核',
  5: '审核驳回',
  6: '审核通过',
})

const assignedDialogVisible = ref(false)
const parameterDialogVisible = ref(false)
const userForm = ref({
  analysis_uid: '',
  notes: '',
  paramsString: '',
})

const addSampleForm = ref({
  data: '',
  name: '',
  record_sn: '',
  formName: '',
  testParamId: '',
})
const selectedUsers = ref([])
const activeName = ref('first')
const activeTableName = ref('first')
const sampleSnList = ref([])
const review_content = ref('')
const contentDialogVisible = ref(false)
onMounted(() => {
  // 分析单详情
  getStatusPageDetail()
//   质控单详情
  getStatusQcPageDetail()
  //   获取分析人
  getPersonnelList()
  //   获取样品编号
  handleSwitchdrawer()
})
const handleClick = (tab) => {
  activeName.value = tab.props.name
}
const handleTableClick = (tab) => {
  activeTableName.value = tab.props.name;
  if (activeTableName.value === 'seconds') {
    // 深拷贝 filteredData
    filteredData.value = JSON.parse(JSON.stringify(analyseTableList.value.filter(item =>
        item.check_statuses && item.check_statuses.split(',').map(status => status.trim()).includes('4')
    )));
  }
  if (activeTableName.value === 'check') {
    // 深拷贝 checkList
    checkList.value = JSON.parse(JSON.stringify(analyseTableList.value.filter(item =>
        item.check_statuses && item.check_statuses.split(',').map(status => status.trim()).includes('1')
    )));
  }
}


// 获取分析单详情
function getStatusPageDetail() {
  AnalyesAPI.echoCgDetailTable({
    task_id: analyseStatusPage.sampleStatus.taskId,
    id: analyseStatusPage.sampleStatus.id,
    type: 0
  }).then(data => {
    form.value = {...data.order, ...data.task_info}
    data.test_parms = data.test_parms.map(item => {
      // 将字段分割为数组
      const analysisForms = item.analysis_forms ? item.analysis_forms.split(",") : [];
      const recordSns = item.record_sns ? item.record_sns.split(",") : [];
      const checkStatuses = item.check_statuses ? item.check_statuses.split(",") : [];
      const submitDate = item.submit_dates ? item.submit_dates.split(",") : [];
      const reviewDate = item.review_dates ? item.review_dates.split(",") : [];
      const addFormId = item.add_form_id ? item.add_form_id.split(",") : [];
      const createdby = item.createdby ? item.createdby.split(",") : [];
      const reviewers = item.reviewers ? item.reviewers.split(",") : [];
      const review_content = item.review_content ? item.review_content.split(",") : [];
      const check_content = item.check_content ? item.check_content.split(",") : [];

      // 处理数据，生成新的格式
      const processedData = analysisForms.map((form, index) => ({
        name: form,
        check_statuses: parseInt(checkStatuses[index], 10),  // 转换为整数
        record_sns: parseInt(recordSns[index], 10), // 转换为整数
        addId: parseInt(addFormId[index], 10), // 转换为整数
        submit_dates: submitDate[index],
        review_date: reviewDate[index],
        createdby: createdby[index],
        reviewers: reviewers[index],
        review_content: review_content[index],
        check_content: check_content[index],
      }));

      // 给每个 item 添加一个新的字段 processed_data
      return {
        ...item,
        processed_data: processedData
      };
    });

    console.log(data.test_parms);
    analyseTableList.value = data.test_parms

    personnelList.value = data.test_parms
  })
}

// 获取分析单详情
function getStatusQcPageDetail() {
  AnalyesAPI.getQcDetailsPage({qc_id: analyseStatusPage.sampleStatus.qcId}).then(data => {
    console.log('质控单详情', data)
    qcForm.value = data
  })
}

// 获取分析人
function getPersonnelList() {

}


// 打开弹框
function handleOpenDialog(row) {
  AnalyesAPI.getAnalyseForm().then(data => {
    console.log(data)
    addSampleForm.value.testParamId = row.id
    selectedUsers.value = data
    userForm.value.paramsString = `${row.sample_category}（${row.test_parms}）`;
    assignedDialogVisible.value = true
  })
}

const fetchSearchResults = (query) => {
  console.log(query)
  if (query === '') return
  AnalyesAPI.getAnalyseForm({name: query}).then(data => {
    console.log(data)
    selectedUsers.value = data
  })
}

// 合并参数多选
const fetchMergeResults = (query) => {
  console.log(query)
  if (query === '') return
  // AnalyesAPI.getAnalyseForm({name: query}).then(data => {
  //   console.log(data)
  //   selectedUsers.value = data
  // })
}

// 添加表格
const handleSureSample = () => {
  let json = {
    test_param_id: addSampleForm.value.testParamId,
    analysis_form_id: addSampleForm.value.name,
    record_sn: addSampleForm.value.record_sn,
    form_name: addSampleForm.value.formName,
  }
  AnalyesAPI.handleAddSampleForm(json).then(data => {
    ElMessage.success('添加成功')
    assignedDialogVisible.value = false
    // 分析单详情
    getStatusPageDetail()
  })
}


const handleSelectionChange = (value) => {
  const selectedObject = selectedUsers.value.find(user => user.id === value);
  addSampleForm.value.record_sn = selectedObject.record_sn
  addSampleForm.value.formName = selectedObject.form_name
}

function handleClose() {
  assignedDialogVisible.value = false
}

function handleOpen(item) {
  console.log(item)
  parameterForm.value = item
  parameterForm.value.test_parms = item.test_parms
  // 排除掉选中的项
  personnelList.value = personnelList.value.filter(data => data.id !== item.id);
  parameterDialogVisible.value = true
}

const handleFilterUser = (value) => {
  console.log('选中的内容', value)
  console.log(parameterForm.value.testparmsId)
}

// 确认合并
const handleParametersList = () => {
  parameterForm.value.testparmsId.push(parameterForm.value.id)
  // 过滤原数组，保留 id 匹配 selectedIds 的对象
  const filteredItems = personnelList.value.filter(item => parameterForm.value.testparmsId.includes(item.id));

  // 提取 test_parms 字段并拼接成字符串
  parameterForm.value.testParms = filteredItems.map(item => item.test_parms).join(',') + `,${parameterForm.value.test_parms}`;
  console.log(parameterForm.value.testParms)


  const formData = new FormData()
  formData.append('source_param_ids', JSON.stringify(parameterForm.value.testparmsId));
  formData.append('task_id', analyseStatusPage.sampleStatus.taskId);
  formData.append('analysis_uids', parameterForm.value.analysis_uids);
  formData.append('analysis_names', parameterForm.value.analysis_names);
  formData.append('check_uid', parameterForm.value.check_uid);
  formData.append('check_name', parameterForm.value.check_name);
  formData.append('sample_category_id', parameterForm.value.sample_category_id);
  formData.append('sample_category', parameterForm.value.sample_category);
  formData.append('test_parms_type', parameterForm.value.test_parms_type);
  formData.append('testparms_id', parameterForm.value.testparms_id ?? 0);
  formData.append('test_method_number', parameterForm.value.test_method_number);
  formData.append('test_method', parameterForm.value.test_method);
  formData.append('test_parms', parameterForm.value.testParms);

  AnalyesAPI.handleMergeParameters(formData).then(data => {
    ElMessage.success('参数合并成功')
    // 分析单详情
    getStatusPageDetail()
    parameterDialogVisible.value = false
  })
}

function handleParameterClose() {
  parameterDialogVisible.value = false
}

function handlePage(row, item) {
  analyseStatusPage.waterForm.task_number = form.value.task_number
  analyseStatusPage.waterForm.id = row.id
  analyseStatusPage.waterForm.record_sn = item.record_sns
  analyseStatusPage.waterForm.add_form_id = item.addId
  analyseStatusPage.waterForm.taskId = form.value.task_id
  analyseStatusPage.waterForm.tableItem = row
  analyseStatusPage.waterForm.tableItemList = item
  analyseStatusPage.waterForm.test_category = qcForm.value.order_info.test_category
  console.log(item)
  // if ((row.check_statuses === 0 || row.check_statuses === 2 || row.check_statuses === 4) && userInfo.id == item.createdby) {
  //   router.push({
  //     path: '/analyse/water-method'
  //   })
  // } else {
  //   router.push({
  //     path: '/analyse/water-methodDetail'
  //   })
  // }
  const routeKey = item.record_sns;
  const routePath = routeMap[routeKey] || 'default-path'; // 如果没有找到对应的键，使用默认路径

  // 跳转到映射的路径
  router.push({
    path: `/analyse/${routePath}`
  });
}

// 拆分参数
const handleSpliteTable = (row) => {
  const formData = new FormData()
  formData.append('source_param_ids', row.id);
  formData.append('task_id', analyseStatusPage.sampleStatus.taskId);
  formData.append('analysis_uids', row.analysis_uids);
  formData.append('analysis_names', row.analysis_names);
  formData.append('check_uid', row.check_uid);
  formData.append('check_name', row.check_name);
  formData.append('sample_category_id', row.sample_category_id);
  formData.append('sample_category', row.sample_category);
  formData.append('test_parms_type', row.test_parms_type);
  formData.append('testparms_id', row.testparms_id);
  formData.append('test_method_number', row.test_method_number);
  formData.append('test_method', row.test_method);
  formData.append('test_parms', row.test_parms);
  AnalyesAPI.handleSplitParameters(formData).then(data => {
    console.log(data)
    ElMessage.success('参数拆分成功')
    // 分析单详情
    getStatusPageDetail()
  })
}


// 删除分析单
const handleDelete = (item, row) => {
  console.log(item, row)
  ElMessageBox.confirm(
      '确认要删除改数据吗？',
      '',
      {
        confirmButtonText: '确认',
        cancelButtonText: '取消',
        type: 'warning',
      }
  )
      .then(() => {
        let json = {
          test_param_id: row.id,
          analysis_form_id: item.addId
        }
        AnalyesAPI.handleDeleteList(json).then(data => {
          console.log(data)
          ElMessage.success('删除成功！')
          // 分析单详情
          getStatusPageDetail()

        })
      })
      .catch(() => {
        ElMessage({
          type: 'info',
          message: 'Delete canceled',
        })
      })
}

// 隐藏删除图标
const isUserAuthorized = (analysisuids) => {
  const userIds = analysisuids.split(',').map(Number);
  return userIds.includes(userInfo.id)
}

// 获取样品编号
const handleSwitchdrawer = () => {
  let json = {
    task_id: analyseStatusPage.sampleStatus.taskId,
    test_category: analyseStatusPage.waterForm.test_category,
  }
  AnalyesAPI.getSamplesn(json).then(res => {
    if (analyseStatusPage.waterForm.test_category === '来样检测') {
      sampleSnList.value = mergeDataByTestParms(res)
    } else {
      sampleSnList.value = res
    }
  })
}


const mergeDataByTestParms = (data) => {
  return data.reduce((acc, item) => {
    // 查找是否已经有相同的 test_parms 和 sample_category
    const existing = acc.find(entry => entry.test_parms === item.test_parms && entry.sample_category === item.sample_category);
    if (existing) {
      // 如果已经存在相同的 test_parms 和 sample_category，直接添加到 list 中
      existing.list.push({
        "sample_sn": item.sample_sn,
        "sampling_date": item.sampling_date
      });
    } else {
      // 如果不存在相同的 test_parms 和 sample_category，创建一个新条目
      acc.push({
        "test_parms": item.test_parms,
        "sample_category": item.sample_category,
        "list": [{
          "sample_sn": item.sample_sn,
          "sampling_date": item.sampling_date
        }]
      });
    }
    return acc;
  }, []);
}

const handleOpenLog = (item) => {
  if (item.check_statuses === 5) {
    contentDialogVisible.value = true
    review_content.value = item.review_content
  } else if (item.check_statuses === 2) {
    contentDialogVisible.value = true
    review_content.value = item.check_content
  }
}

const handleContentClose = () => {
  contentDialogVisible.value = false
  review_content.value = ''
}
</script>

<template>
  <div class="card">
    <el-card class="box-card">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="样品分析" name="first">
          <el-row>
            <el-col :span="6" class="syc-flex syc-flex-align-center ">
              任务名称：{{ form.task_name }}
            </el-col>
            <el-col :span="6" class="syc-flex syc-flex-align-center ">
              任务单号：{{ form.task_number }}
            </el-col>
            <el-col :span="6" class="syc-flex syc-flex-align-center ">
              关联委托单号：{{ form.order_number }}
            </el-col>
            <el-col :span="6" class="syc-flex syc-flex-align-center ">
              项目名称：{{ form.project_name }}
            </el-col>
            <el-col :span="6" class="syc-flex syc-flex-align-center ">
              检测周期：{{ form.test_period }}
            </el-col>
            <el-col :span="6" class="syc-flex syc-flex-align-center ">
              采样地点：{{ form.task_address }}
            </el-col>
            <el-col :span="6" class="syc-flex syc-flex-align-center ">
              分派人：{{ form.issueder }}
            </el-col>
            <el-col :span="6" class="syc-flex syc-flex-align-center ">
              分派时间：{{ form.issuedtime }}
            </el-col>
          </el-row>
        </el-tab-pane>
        <!--        <el-tab-pane label="质控单详情" name="second">-->
        <!--          <el-row>-->
        <!--            <el-col :span="6" class="syc-flex syc-flex-align-center ">-->
        <!--              质控单号：{{ qcForm?.qc_info?.qc_number }}-->
        <!--            </el-col>-->
        <!--            <el-col :span="6" class="syc-flex syc-flex-align-center ">-->
        <!--              任务名称：{{ qcForm?.order_info?.task_name }}-->
        <!--            </el-col>-->
        <!--            <el-col :span="6" class="syc-flex syc-flex-align-center ">-->
        <!--              任务单号：{{ qcForm?.order_info?.task_number }}-->
        <!--            </el-col>-->
        <!--            <el-col :span="6" class="syc-flex syc-flex-align-center ">-->
        <!--              关联委托单号：{{ qcForm?.task_info?.task_number }}-->
        <!--            </el-col>-->
        <!--            <el-col :span="6" class="syc-flex syc-flex-align-center ">-->
        <!--              项目名称：{{ qcForm?.order_info?.project_name }}-->
        <!--            </el-col>-->
        <!--            <el-col :span="6" class="syc-flex syc-flex-align-center ">-->
        <!--              检测周期：{{ qcForm?.task_info?.test_period }}-->
        <!--            </el-col>-->
        <!--            <el-col :span="6" class="syc-flex syc-flex-align-center ">-->
        <!--              采样地点：{{ qcForm?.order_info?.sampling_address }}-->
        <!--            </el-col>-->
        <!--            <el-col :span="6" class="syc-flex syc-flex-align-center ">-->
        <!--              状态：{{-->
        <!--                qcForm?.order_info?.status == '1' ? '待下发' : qcForm?.order_info?.status == '2' ? '已下发' : qcForm?.order_info?.status == '3' ? '已取消' : ''-->
        <!--              }}-->
        <!--            </el-col>-->
        <!--          </el-row>-->
        <!--        </el-tab-pane>-->
        <el-tab-pane label="样品编号详情" name="third">
          <el-card class="box-card" style="margin-top: 30px">
            <div class="card-button" style="margin-bottom: 30px">
              样品编号
            </div>
            <el-table style="width: 100%" border :data="sampleSnList">
              <el-table-column label="序号" align="center">
                <template #default="scope">{{ scope.$index + 1 }}</template>
              </el-table-column>
              <el-table-column prop="sample_category" label="样品类别" align="center">
              </el-table-column>
              <el-table-column prop="test_parms" label="检测参数" align="center">
              </el-table-column>
              <el-table-column prop="" label="样品编号" align="center" width="800">
                <template #default="scope">
                  <div v-if="scope.row.sample_sn === undefined">
                    <div v-for="(item,index) in scope.row.list" :key="index">
                      <div style="text-align: left;margin-left: 20px">{{ item.sample_sn }} {{ item.sampling_date }} 、
                      </div>
                    </div>
                  </div>
                  <div v-else style="text-align: left;margin-left: 20px">
                    {{ scope.row.sample_sn }} {{ scope.row.sampling_date }}
                  </div>

                </template>
              </el-table-column>
            </el-table>
          </el-card>
        </el-tab-pane>
      </el-tabs>
    </el-card>
    <template v-if="activeName === 'first'">
      <!--    表格内容-->
      <el-card class="box-card" style="margin-top: 30px">
        <el-tabs v-model="activeTableName" @tab-click="handleTableClick">
          <el-tab-pane label="检测参数分析" name="first">
            <el-table style="width: 100%" border :data="analyseTableList">
              <el-table-column prop="name" label="操作" align="center">
                <template #default="scope">
                  <el-dropdown>
                    <el-button type="primary" size="small">
                      操作
                      <el-icon class="el-icon--right">
                        <arrow-down/>
                      </el-icon>
                    </el-button>
                    <template #dropdown>
                      <el-dropdown-menu>
                        <el-dropdown-item v-if="isUserAuthorized(scope.row.analysis_uids)"
                                          @click="handleOpenDialog(scope.row)">添加表单
                        </el-dropdown-item>
                        <el-dropdown-item @click="handleOpen(scope.row)"
                                          v-if="scope.row.add_form_id === null && isUserAuthorized(scope.row.analysis_uids)">
                          合并参数
                        </el-dropdown-item>
                        <el-dropdown-item @click="handleSpliteTable(scope.row)"
                                          v-if="scope.row.add_form_id === null  && isUserAuthorized(scope.row.analysis_uids)">
                          拆分参数
                        </el-dropdown-item>
                      </el-dropdown-menu>
                    </template>
                  </el-dropdown>
                </template>
              </el-table-column>
              <el-table-column prop="date" label="序号" align="center">
                <template #default="scope">{{ scope.$index + 1 }}</template>
              </el-table-column>
              <el-table-column prop="sample_category" label="样品类别" align="center">
              </el-table-column>
              <el-table-column prop="test_parms" label="检测参数" align="center" width="180">
                <template #default="scope">
                  <div>
                    <span v-show="scope.row.test_parms_type === 1">*</span>
                    {{ scope.row.test_parms }}
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="test_method" label="检测依据" align="center">
                <template #default="scope">
                  <span>{{
                      scope.row.test_method === null ? scope.row.test_method_number : scope.row.test_method
                    }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="" label="分析表单" align="center" width="400">
                <template #default="scope">
                  <div class="analyze-forms" @click="handlePage(scope.row,item)"
                       v-for="(item,index) in scope.row.processed_data">
                    <div class="analyze-box">
                      <div class="analyze-text">分析-{{ item.name }} - {{ item.submit_dates }}</div>
                      <div style="display: flex;align-items: center;margin-left: 20px">
                        <el-icon size="16" @click.stop="handleDelete(item,scope.row)"
                                 v-show="isUserAuthorized(scope.row.analysis_uids)">
                          <Coffee/>
                        </el-icon>
                        <div class="analyze-line"></div>
                        <div class="analyze-status" @click.stop="handleOpenLog(item)" :style="{
                            color: item.check_statuses === 1 || item.check_statuses === 4 ? '#ff7e00' :
                             item.check_statuses === 3 || item.check_statuses === 6 ? '#34BE06' :
                             item.check_statuses === 2 || item.check_statuses === 5 ? '#FF0000' : ''
                          }">
                          {{ statusMap[item.check_statuses] || '' }}
                        </div>
                        <div class="analyze-line"></div>
                        <div class="analyze-status">
                          {{ item.reviewers }}
                        </div>
                      </div>
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="notes" label="备注" align="center">
              </el-table-column>
              <el-table-column prop="createtime" label="提交时间" align="center">
              </el-table-column>
              <el-table-column prop="check_name" label="校核人" align="center">
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <el-tab-pane label="待校核" name="check">
            <el-table style="width: 100%" border :data="checkList">
              <el-table-column prop="name" label="操作" align="center">
                <template #default="scope">
                  <el-dropdown>
                    <el-button type="primary" size="small">
                      操作
                      <el-icon class="el-icon--right">
                        <arrow-down/>
                      </el-icon>
                    </el-button>
                    <template #dropdown>
                      <el-dropdown-menu>
                        <el-dropdown-item v-if="isUserAuthorized(scope.row.analysis_uids)"
                                          @click="handleOpenDialog(scope.row)">添加表单
                        </el-dropdown-item>
                        <el-dropdown-item @click="handleOpen(scope.row)"
                                          v-if="scope.row.add_form_id === null && isUserAuthorized(scope.row.analysis_uids)">
                          合并参数
                        </el-dropdown-item>
                        <el-dropdown-item @click="handleSpliteTable(scope.row)"
                                          v-if="scope.row.add_form_id === null  && isUserAuthorized(scope.row.analysis_uids)">
                          拆分参数
                        </el-dropdown-item>
                      </el-dropdown-menu>
                    </template>
                  </el-dropdown>
                </template>
              </el-table-column>
              <el-table-column prop="date" label="序号" align="center">
                <template #default="scope">{{ scope.$index + 1 }}</template>
              </el-table-column>
              <el-table-column prop="sample_category" label="样品类别" align="center">
              </el-table-column>
              <el-table-column prop="test_parms" label="检测参数" align="center" width="180">
                <template #default="scope">
                  <div>
                    <span v-show="scope.row.test_parms_type === 1">*</span>
                    {{ scope.row.test_parms }}
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="test_method" label="检测依据" align="center">
                <template #default="scope">
                  <span>{{
                      scope.row.test_method === null ? scope.row.test_method_number : scope.row.test_method
                    }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="" label="分析表单" align="center" width="400">
                <template #default="scope">
                  <div class="analyze-forms" @click="handlePage(scope.row,item)" v-show="item.check_statuses === 1"
                       v-for="(item,index) in scope.row.processed_data">
                    <div class="analyze-box">
                      <div class="analyze-text">分析-{{ item.name }} - {{ item.submit_dates }}</div>
                      <div style="display: flex;align-items: center;margin-left: 20px">
                        <el-icon size="16" @click.stop="handleDelete(item,scope.row)"
                                 v-show="isUserAuthorized(scope.row.analysis_uids)">
                          <Coffee/>
                        </el-icon>
                        <div class="analyze-line"></div>
                        <div class="analyze-status" :style="{
                            color: item.check_statuses === 1 || item.check_statuses === 4 ? '#ff7e00' :
                             item.check_statuses === 3 || item.check_statuses === 6 ? '#34BE06' :
                             item.check_statuses === 2 || item.check_statuses === 5 ? '#FF0000' : ''
                          }">
                          {{ statusMap[item.check_statuses] || '' }}
                        </div>
                        <div class="analyze-line"></div>
                        <div class="analyze-status">
                          {{ item.reviewers }}
                        </div>
                      </div>
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="notes" label="备注" align="center">
              </el-table-column>
              <el-table-column prop="createtime" label="提交时间" align="center">
              </el-table-column>
              <el-table-column prop="check_name" label="校核人" align="center">
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <el-tab-pane label="待审核" name="seconds">
            <el-table style="width: 100%" border :data="filteredData">
              <el-table-column prop="name" label="操作" align="center">
                <template #default="scope">
                  <el-dropdown>
                    <el-button type="primary" size="small">
                      操作
                      <el-icon class="el-icon--right">
                        <arrow-down/>
                      </el-icon>
                    </el-button>
                    <template #dropdown>
                      <el-dropdown-menu>
                        <el-dropdown-item v-if="isUserAuthorized(scope.row.analysis_uids)"
                                          @click="handleOpenDialog(scope.row)">添加表单
                        </el-dropdown-item>
                        <el-dropdown-item @click="handleOpen(scope.row)"
                                          v-if="scope.row.add_form_id === null && isUserAuthorized(scope.row.analysis_uids)">
                          合并参数
                        </el-dropdown-item>
                        <el-dropdown-item @click="handleSpliteTable(scope.row)"
                                          v-if="scope.row.add_form_id === null  && isUserAuthorized(scope.row.analysis_uids)">
                          拆分参数
                        </el-dropdown-item>
                      </el-dropdown-menu>
                    </template>
                  </el-dropdown>
                </template>
              </el-table-column>
              <el-table-column prop="date" label="序号" align="center">
                <template #default="scope">{{ scope.$index + 1 }}</template>
              </el-table-column>
              <el-table-column prop="sample_category" label="样品类别" align="center">
              </el-table-column>
              <el-table-column prop="test_parms" label="检测参数" align="center" width="180">
                <template #default="scope">
                  <div>
                    <span v-show="scope.row.test_parms_type === 1">*</span>
                    {{ scope.row.test_parms }}
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="test_method" label="检测依据" align="center">
                <template #default="scope">
                  <span>{{
                      scope.row.test_method === null ? scope.row.test_method_number : scope.row.test_method
                    }}</span>
                </template>
              </el-table-column>
              <el-table-column prop="" label="分析表单" align="center" width="400">
                <template #default="scope">
                  <div class="analyze-forms" @click="handlePage(scope.row,item)" v-show="item.check_statuses === 4"
                       v-for="(item,index) in scope.row.processed_data">
                    <div class="analyze-box">
                      <div class="analyze-text">分析-{{ item.name }} - {{ item.submit_dates }}</div>
                      <div style="display: flex;align-items: center;margin-left: 20px">
                        <el-icon size="16" @click.stop="handleDelete(item,scope.row)"
                                 v-show="isUserAuthorized(scope.row.analysis_uids)">
                          <Coffee/>
                        </el-icon>
                        <div class="analyze-line"></div>
                        <div class="analyze-status" :style="{
                            color: item.check_statuses === 1 || item.check_statuses === 4 ? '#ff7e00' :
                             item.check_statuses === 3 || item.check_statuses === 6 ? '#34BE06' :
                             item.check_statuses === 2 || item.check_statuses === 5 ? '#FF0000' : ''
                          }">
                          {{ statusMap[item.check_statuses] || '' }}
                        </div>
                        <div class="analyze-line"></div>
                        <div class="analyze-status">
                          {{ item.reviewers }}
                        </div>
                      </div>
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column prop="notes" label="备注" align="center">
              </el-table-column>
              <el-table-column prop="createtime" label="提交时间" align="center">
              </el-table-column>
              <el-table-column prop="check_name" label="校核人" align="center">
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <!--          <el-tab-pane label="单据校核" name="second">-->
          <!--            <el-table style="width: 100%" border :data="qcForm.qcanalysismethod_info">-->
          <!--              <el-table-column label="序号" align="center">-->
          <!--                <template #default="scope">{{ scope.$index + 1 }}</template>-->
          <!--              </el-table-column>-->
          <!--              <el-table-column prop="sample_category" label="样品类别" align="center">-->
          <!--              </el-table-column>-->
          <!--              <el-table-column prop="test_params" label="检测参数" align="center">-->
          <!--              </el-table-column>-->
          <!--              <el-table-column prop="test_params" label="检测依据" align="center">-->
          <!--              </el-table-column>-->
          <!--              <el-table-column prop="test_params" label="分析表单" align="center">-->
          <!--                <template #default="scope">-->
          <!--                  <div class="analyze-forms" v-for="(item,index) in 2" :key="index">-->
          <!--                    <div class="analyze-box">-->
          <!--                      <div class="analyze-text">分析-水质-容量法-20240909</div>-->
          <!--                      <div style="display: flex;align-items: center">-->
          <!--                        <el-icon size="16">-->
          <!--                          <Coffee/>-->
          <!--                        </el-icon>-->
          <!--                        <div class="analyze-line"></div>-->
          <!--                        <div class="analyze-status">待校核</div>-->
          <!--                      </div>-->
          <!--                    </div>-->
          <!--                  </div>-->
          <!--                </template>-->
          <!--              </el-table-column>-->
          <!--              <el-table-column prop="test_params" label="备注" align="center">-->
          <!--              </el-table-column>-->
          <!--              <el-table-column prop="sampling_qc_note" label="提交时间" align="center">-->
          <!--              </el-table-column>-->
          <!--            </el-table>-->
          <!--          </el-tab-pane>-->
        </el-tabs>
      </el-card>
    </template>

    <template v-if="activeName === 'second'">
      <el-card class="box-card" style="margin-top: 30px">
        <div style="margin-bottom: 30px">
          分析质控
        </div>
        <el-table style="width: 100%" border :data="qcForm.qcanalysismethod_info">
          <el-table-column prop="date" label="序号" align="center">
            <template #default="scope">{{ scope.$index + 1 }}</template>
          </el-table-column>
          <el-table-column prop="sample_category" label="样品类别" align="center">
          </el-table-column>
          <el-table-column prop="analysis_params" label="检测参数" align="center">
          </el-table-column>
          <el-table-column prop="analysis_qc_method" label="质控措施" align="center">
          </el-table-column>
          <el-table-column prop="analysis_qc_note" label="备注" align="center">
          </el-table-column>
        </el-table>
      </el-card>
    </template>

    <!--      <div class="pagination">-->
    <!--        <el-pagination-->
    <!--            background-->
    <!--            layout="prev, pager, next"-->
    <!--            :total="20">-->
    <!--        </el-pagination>-->
    <!--      </div>-->
    <!--    表格内容-->
    <!--      <div class="pagination">-->
    <!--        <el-pagination-->
    <!--            background-->
    <!--            layout="prev, pager, next"-->
    <!--            :total="20">-->
    <!--        </el-pagination>-->
    <!--      </div>-->
    <el-dialog title="添加表单" v-model="assignedDialogVisible" width="30%" center :before-close="handleClose">
      <el-form ref="form" :model="addSampleForm" label-width="90px">
        <el-form-item label="分析表单：">
          <el-select v-model="addSampleForm.name" placeholder="请选择" filterable remote
                     :remote-method="fetchSearchResults" @change="handleSelectionChange">
            <el-option
                v-for="(label, value) in selectedUsers"
                :key="value"
                :label="label.form_name"
                :value="label.id">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer" style="display: flex;justify-content: center">
        <el-button @click="handleClose" style="width: 50%">取 消</el-button>
        <el-button type="primary" style="width: 50%" @click="handleSureSample">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog title="驳回原因" v-model="contentDialogVisible" width="30%" center :before-close="handleContentClose">
      <div>驳回原因： {{ review_content }}</div>
      <span slot="footer" class="dialog-footer" style="display: flex;justify-content: center">
<!--        <el-button @click="handleContentClose">取 消</el-button>-->
      </span>
    </el-dialog>

    <el-dialog title="合并参数" v-model="parameterDialogVisible" width="30%" center
               :before-close="handleParameterClose">
      <el-form ref="form" :model="parameterForm" label-width="90px">
        <el-form-item label="检测参数：">
          {{ parameterForm.test_parms }}
        </el-form-item>
        <el-form-item label="追加参数：">
          <el-select v-model="parameterForm.testparmsId" multiple filterable remote placeholder="请选择"
                     :remote-method="fetchMergeResults" @change="handleFilterUser">
            <el-option
                v-for="(label, value) in personnelList"
                :key="value"
                :label="label.test_parms"
                :value="label.id">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer" style="display: flex;justify-content: center">
        <el-button @click="handleParameterClose" style="width: 50%">取 消</el-button>
        <el-button type="primary" style="width: 50%" @click="handleParametersList">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<style scoped lang="scss">
.card {
  padding: 20px 25px;
}

.pagination {
  margin-top: 30px;
  display: flex;
  justify-content: flex-end;
}

.syc-flex {
  display: flex;
}

.syc-flex-align-center {
  margin: 10px 0;
  align-items: center;
}

.syc-flex-justify-center {
  justify-content: center;
}

.analyze {
  &-forms {
    margin: 10px;
    font-size: 13px;
    cursor: pointer;
  }

  &-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #cccccc;
    border-radius: 10px;
    padding: 5px 10px;
  }

  &-status {
    width: 60px;
  }

  &-line {
    width: 1px;
    height: 15px;
    background-color: #cccccc;
    margin: 0 10px;
  }

  &-text {
    width: 60%;
    text-align: left;
  }
}

</style>
